<!--台账信息-->
<template>
  <div>
    <!--产废台账-->
    <div class="order" v-if="isestateLedger">
      <div>
        <div style="display: flex; justify-content: space-between">
          <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="危废类型">
              <el-select v-model="formInline.wasteType" placeholder="请选择">
                <el-option
                  v-for="item in speciesData"
                  :key="item.id"
                  :value="item.id"
                  :label="item.name"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="台账类型">
              <el-select v-model="formInline.ledgerType" placeholder="请选择">
                <el-option label="入库" value="1"></el-option>
                <el-option label="出库" value="2"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="开始时间">
              <el-date-picker
                v-model="formInline.startTime"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions0"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>

            <el-form-item label="结束时间">
              <el-date-picker
                v-model="formInline.endTime"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions1"
                format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
              ></el-date-picker>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="searchList">查询</el-button>
              <el-button type="default" @click="resetFormConditions">重置</el-button>
              <el-button type="primary" @click="addRole" class="addBtn">新增</el-button>
              <el-button type="primary" @click="downloadRole" class="addBtn">下载</el-button>
              <el-button type="primary" @click="previewRole" class="addBtn">预览</el-button>
            </el-form-item>
          </el-form>
        </div>

        <div class="tables">
          <el-table
            ref="multipleTable"
            :data="tablesAnnual"
            tooltip-effect="dark"
            style="width: 100%"
          >
            <el-table-column type="index" label="序号" width="50"></el-table-column>
            <el-table-column prop="createAt" label="日期">
              <template slot-scope="scope">
                <span>{{$dateFormat(scope.row.createAt,'yyyy-MM-dd hh:mm:ss')}}</span>
              </template>
            </el-table-column>
            <el-table-column prop="companyName" label="单位名称"></el-table-column>
            <el-table-column prop="wasteTypeName" label="危废类型"></el-table-column>
            <el-table-column prop="inPut" label="产生数量(入库)"></el-table-column>
            <el-table-column prop="outPut" label="转移数量(出库)"></el-table-column>
            <el-table-column prop="total" label="库存数量"></el-table-column>
            <el-table-column prop="createBy" label="填写人"></el-table-column>
          </el-table>
        </div>

        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="10"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        ></el-pagination>
        <!--新增-->
        <el-dialog title="年度申报新增" :visible.sync="annualReturnAdd" size="tiny">
          <el-form :model="templateFormAdd" class="templateFroms" :rules="rules" ref="templateFormAdd">
            <el-form-item label="单位名称" label-width="150px" >
              <el-input disabled clearable v-model="templateFormAdd.companyName" placeholder="单位名称"></el-input>
            </el-form-item>
            <el-form-item label="危废类型" label-width="150px" prop="wasteType">
              <el-select v-model="templateFormAdd.wasteType"  @change="getCurrentWasteCode">
                <el-option
                  v-for="item in speciesData"
                  :key="item.id"

                  :value="item.dangerousType"
                  :label="item.name"
                ></el-option>
              </el-select>

            </el-form-item>
            <el-form-item label="危废代码" label-width="150px">
              <el-input type="text" clearable v-model="templateFormAdd.wasteCode" placeholder="危废代码" disabled></el-input>
            </el-form-item>
            <el-form-item label="年度" label-width="150px" prop="year">
              <el-input type="text" clearable v-model="templateFormAdd.year" placeholder="年度"></el-input>
            </el-form-item>
            <el-form-item label="本年度计划产生总量" label-width="150px" prop="yearPlan">
              <el-input type="number" clearable v-model="templateFormAdd.yearPlan" placeholder="吨"></el-input>
            </el-form-item>
            <el-form-item label="下年度计划产生总量 " label-width="150px" prop="nextYearPlan">
              <el-input type="number" clearable v-model="templateFormAdd.nextYearPlan" placeholder="吨"></el-input>
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="saveUpload('templateFormAdd')">确 定</el-button>
            <el-button type="primary" @click="reload()">取 消</el-button>
          </div>
        </el-dialog>
        <!--下载-->
        <el-dialog title="年度申报下载" :visible.sync="annualDownload" size="tiny">
          <el-form :model="templateForm" class="templateFroms">
            <el-form-item label="单位名称" label-width="150px">
              <el-input
                :disabled="true"
                clearable
                v-model="templateForm.companyName"
                placeholder="单位名称"
              ></el-input>
            </el-form-item>
            <el-form-item label="危废类型" label-width="150px">
              <el-input
                :disabled="true"
                clearable
                v-model="templateForm.harmType"
                placeholder="危废类型"
              ></el-input>
            </el-form-item>
            <el-form-item label="危废代码" label-width="150px">
              <el-input type="text" clearable v-model="templateForm.harmCode" placeholder="危废代码"></el-input>
            </el-form-item>
            <el-form-item label="开始时间" label-width="150px">
              <el-date-picker
                v-model="formInline.value3"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions0"
              ></el-date-picker>
            </el-form-item>
            <el-form-item label="结束时间" label-width="150px">
              <el-date-picker
                v-model="formInline.value3"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions0"
              ></el-date-picker>
            </el-form-item>
            <el-form-item label="报表样式 " label-width="150px">
              <template>
                <el-radio-group v-model="radio2">
                  <el-radio :label="3">月报</el-radio>
                  <el-radio :label="6">季报</el-radio>
                  <el-radio :label="9">年报</el-radio>
                </el-radio-group>
              </template>
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="downloadUpload">保 存</el-button>
            <el-button type="primary" @click="downloadAbolish">取 消</el-button>
          </div>
        </el-dialog>
        <!--预览-->
        <el-dialog title="年度申报预览" :visible.sync="isPreview" size="tiny">
          <el-form :model="templateForm" class="templateFroms">
            <el-form-item label="单位名称" label-width="150px">
              <el-input
                :disabled="true"
                clearable
                v-model="templateForm.companyName"
                placeholder="单位名称"
              ></el-input>
            </el-form-item>
            <el-form-item label="危废类型" label-width="150px">
              <el-input
                :disabled="true"
                clearable
                v-model="templateForm.harmType"
                placeholder="危废类型"
              ></el-input>
            </el-form-item>
            <el-form-item label="危废代码" label-width="150px">
              <el-input type="text" clearable v-model="templateForm.harmCode" placeholder="危废代码"></el-input>
            </el-form-item>
            <el-form-item label="开始时间" label-width="150px">
              <el-date-picker
                v-model="formInline.value3"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions0"
              ></el-date-picker>
            </el-form-item>
            <el-form-item label="结束时间" label-width="150px">
              <el-date-picker
                v-model="formInline.value3"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions0"
              ></el-date-picker>
            </el-form-item>
            <el-form-item label="出/入库台账" label-width="150px">
              <el-select v-model="formInline.value1" placeholder="请选择">
                <el-option
                  v-for="item in warehousing"
                  :key="item.value"
                  :value="item.value"
                  :label="item.label"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="报表样式 " label-width="150px">
              <template>
                <el-radio-group v-model="radio2">
                  <el-radio :label="3">月报</el-radio>
                  <el-radio :label="6">季报</el-radio>
                  <el-radio :label="9">年报</el-radio>
                </el-radio-group>
              </template>
            </el-form-item>
          </el-form>
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="previewUpload">保 存</el-button>
            <el-button type="primary" @click="previewAbolish">取 消</el-button>
          </div>
        </el-dialog>
      </div>
    </div>
    <!--处置台账-->
    <div v-if="!isestateLedger">
      <div>处置台账</div>
    </div>
  </div>
</template>
<script>
  export default {
    inject: ["reload"],
    data() {
      return {
        //台账区分
        isestateLedger: true,
        // 新增
        annualReturnAdd: false,
        //下载
        radio2: "",
        annualDownload: false,
        //预览
        isPreview: false,
        // 台账新增
        templateFormAdd:{
          companyName:'',
          wasteType:'',
          wasteCode:'',
          year:'',
          yearPlan:'',
          nextYearPlan:''

        },
        templateForm: {
          companyName: "",
          harmType: "",
          harmCode: "",
          year: "",
          yearPlan: "",
          nextYearPlan: ""
        },

        // 操作
        tablesAnnual: [],

        //查询

        formInline: {
          wasteType: null,
          ledgerType: null,
          startTime: null,
          endTime: null
        },
        currentPage: 1,
        total: 0,
        page: 1,
        limit: 10,
        speciesData: [],
        warehousing: [
          {
            value: 1,
            label: "入库"
          },
          {
            value: 2,
            label: "出库"
          },
          {
            value: 3,
            label: "入/出库"
          }
        ],
        rules:{
          wasteType:[
            {
              type:'string',
              required:true,
              message:'请选择危废类型',
              triggle:'change'
            }
          ],
          year:[
            {
              required: true,
              message:'请输入年份',
              triggle:'blur'
            }
          ],
          yearPlan:[
            {
              required: true,
              message:'请输入本年度计划产生量',
              triggle:'blur'
            }
          ],
          nextYearPlan:[
            {
              required: true,
              message:'请输入下年度计划产生量',
              triggle:'blur'
            }
          ]

        }
      };
    },
    mounted() {
      this.initWasteType();
      this.initDataList();
      this.templateFormAdd.companyName =this.$store.state.userInfo.companyName
      // console.log()
      alert(this.$store.state.userInfo.companyName)
    },
    methods: {
      initWasteType() {
        this.templateForm.companyType = localStorage.companyType;

        this.$common.$ajax("/wf/wastetype/wastetype", "get").then(res => {
          if (res.data.status === 200) {
            this.speciesData = res.data.body;
          } else {
          }
        });
      },
      initDataList() {
        this.$common
          .$ajax(
            "/op/ledger/list",
            {
              page: this.page,
              limit: this.limit,
              startTime: this.formInline.startTime,
              endTime: this.formInline.endTime,
              reportType: this.formInline.ledgerType,
              wasteType: this.formInline.wasteType
            },
            "get"
          )
          .then(res => {
            console.log(res.data);
            this.tablesAnnual = res.data.body.list;
            this.total = res.data.body.totalCount;
          });
      },
      //查询
      searchList() {
        console.log(this.formInline);
        this.initDataList();
      },
      //获取危废COde
      getCurrentWasteCode(e){
        console.log(e)
        this.templateFormAdd.wasteCode = e
      },
      //重置
      resetFormConditions() {
        for (let item in this.formInline) {
          this.formInline[item] = null;
        }
        this.initDataList();
      },
      //新增
      addRole() {
        this.annualReturnAdd = true;
      },
      //修改
      revamp(row) {},
      //删除
      deleteRole(row) {},
      handleSizeChange(val) {
        this.limit=val;
        this.initDataList()
      },
      //页数
      handleCurrentChange(val) {
        this.page=val;
        this.initDataList()
      },
      //年度申报新增
      saveUpload(formName) {
        this.$refs[formName].validate((valid)=>{
          if(valid){

          }else{
            console.log('error submit')
          }
        })
      },
      saveAbolish() {
        console.log(1);
      },
      //时间选择
      pickerOptions0: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7;
        }
      },
      pickerOptions1: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7;
        }
      },

      //下载模块
      downloadRole() {
        this.annualDownload = true;
      },
      downloadUpload() {
        this.annualDownload = false;
      },
      downloadAbolish() {
        this.annualDownload = false;
      },
      //预览模块
      previewRole() {
        this.isPreview = true;
      },
      previewUpload() {
        this.isPreview = false;
      },
      previewAbolish() {
        this.isPreview = false;
      }
    },
    components: {}
  };
</script>
<style lang="scss">
</style>
